﻿{include file="public/header"/}
{include file="public/search_t"/}
<div id="file" class="ibox float-e-margins">
    <div class="ibox-content">
        <div class="row common-search" style="margin-top: 10px;margin-bottom: 20px">
            <div class="col-sm-12">
                <form class="form-inline table-form">
                    <!--搜索项-->
                    <div class="form-group">
                        <select class="form-control"  name="type" onchange="refreshTable('file');">
                            <option value="-1">文件类型</option>
                            <option value="media_image">图片</option>
                            <option value="media_audio">音频</option>
                            <option value="media_video">视频</option>
                            <option value="media_word">文件</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <input type="text" name="name" placeholder="请输入文件名" class="form-control">
                    </div>
                    <!--搜索项-->
                    {$html->search_btn()}
                </form>
            </div>
        </div>
        <div  class="toolbar">
            {$html->toolbar('add,del')}
        </div>
        <table class="table table-striped table-hover table-bordered"></table>
    </div>
</div>
{include file="public/search_f"/}
<!--模态窗口-->
<div class="modal inmodal fade" id="videoModal" tabindex="-1" role="dialog"  aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                <h4 class="modal-title" id="videoName">视频预览</h4>
            </div>
            <div class="modal-body">
                <div class="player" id="videoPalyer">
                </div>
            </div>
        </div>
    </div>
</div>
{include file="public/footer"/}
<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript">
    //初始化表格
    var tableName="file";
    var tableName1="sys.file";
    initTable({
        name:tableName,
        config:{
            index_url: '/admin/'+tableName1+'/loadData',
            add_url: '/admin/'+tableName1+'/add',
            del_url: '/admin/'+tableName1+'/del',
            table: tableName
        },
        columns:[
            {checkbox: true},
            {title: '文件名', field: 'name',formatter: function (value, row){
                return '<a href="javascript:modalShow(\''+row.path+ '\',\''+row.type+'\',\''+row.name+'\')">' + row.name + '</a>';
            }},
            {title: '预览 ', field: 'path',formatter:function(v){return getImgField(v)}},
            {title: '类型 ', field: 'type'},
            {title: '路径', field: 'path'},
            {title: '描述', field: 'about'},
            {title: '大小', field: 'size'},
            {title: '创建时间', field: 'ct'},
            {title: '操作', field: 'operate',formatter: function (value, row){
                var down='<a class="btn btn-warning btn-xs" href="' + row.path + '" download="'+row.name+row.suffix+'"><i class="fa fa-arrow-circle-down"></i> 下载</a> ';
                var str="";
                var editUrl="/admin/sys.file/add?id=" +row.id ;
                var e = ' <button class="btn btn-primary btn-xs" type="button" onclick="layer_open(\''+editUrl+'\',\'编辑\')"><i class="fa fa-edit"></i> 编辑</button> ';
                str+=e;
                var delUrl="/admin/sys.file/del?id="+row.id;
                var d = '<button class="btn btn-danger btn-xs" type="button" onclick="table_del(\''+delUrl+'\',\''+tableName+'\');"><i class="fa fa-trash"></i> 删除</button>';
                str+=d;
                return down+str;
            }}
        ]
    });

    //模态窗口预览
    function modalShow(path,type,name) {
        if(type.indexOf("video")>=0){
            var html='<video controls crossorigin ><source id="video" src="'+path+'" type="video/mp4"></video>';
            $("#videoPalyer").html(html);
            $("#videoName").html(name);

            //设置视频路径
            $('#videoModal').modal('show');
        }else if(type.indexOf("image")>=0){
            var html='<img src="'+path+'" width="100%" height="100%">';
            $("#videoPalyer").html(html);
            $("#videoName").html(name);

            //设置视频路径
            $('#videoModal').modal('show');
        }else if(type.indexOf("audio")>=0){
            var html='<audio controls><source src="'+path+'" type="audio/mp3"></audio>';
            $("#videoPalyer").html(html);
            $("#videoName").html(name);

            //设置视频路径
            $('#videoModal').modal('show');
        }else if(type.indexOf("text")>=0) {
            //取出文件内容
            $.ajax({
                url: "/admin/file/getContent?path=" + path,
                type: 'get',
                dataType: 'json',
                success: function (res) {
                    if (res.rc == 0) {
                        var html='<div>'+res.data+'</div>';
                        $("#videoPalyer").html(html);
                        $("#videoName").html(name);

                        //设置视频路径
                        $('#videoModal').modal('show');
                    } else {
                        swal("文件打开失败！", "", "error");
                    }
                }
            });
        }else{
            swal("暂不支持预览！可下载预览！", "", "error");
        }
    }
</script>
<!--/请在上方写此页面业务相关的脚本-->
